<!--回复中的用户名+IP属地部分-->
<script lang="ts" setup>

import type {ReplyInfo} from "../../network/types/Reply.ts";
import type {UserInfo} from "../../network/types/User.ts";
import {AccountStatus, accountStatusDes} from "../../network/types/AccountStatus.ts";
import UserIp from "../common/UserIp.vue";
import UserRoute from "../routes/UserRoute.vue";

interface Props {
  reply?: ReplyInfo | undefined,
  topicAuthorId?: number | string | undefined
  user?: UserInfo | undefined,
  anonymousName?: string | undefined,
}

const props = defineProps<Props>()

const fetchUserId = (user?: UserInfo | undefined, reply?: ReplyInfo | undefined) => {
  const u1 = user?.userId
  if (u1) return u1
  const u2 = reply?.authorUid
  if (u2) return Number(u2)
  return 0
}
</script>

<template>
  <div class="level-header">
    <span>
      <!--匿名-->
      <span v-if="reply?.anonymous">{{ anonymousName }}
        <el-tag effect="dark" type="danger">匿名</el-tag>
      </span>
      <span v-else-if="user">
        <!--已注销用户-->
        <span v-if="user?.status=== AccountStatus.DISCARD"><span>{{ user?.username }}</span></span>
        <!-- 常规用户名-->
        <user-route v-else :user-id="fetchUserId(user,reply)"><b>{{ user?.username }}</b></user-route>
        <el-text v-if="reply?.authorUid===topicAuthorId && topicAuthorId" type="danger">[楼主]</el-text>
        <!--   账号状态-->
        <el-tag v-if="!reply?.anonymous &&user?.status != AccountStatus.PHONE && user?.status != AccountStatus.LINK " type="danger">
          {{ accountStatusDes(user?.status!!) }}
        </el-tag>
      </span>
    </span>

    <user-ip v-if="!reply?.anonymous && user" :user-id="fetchUserId(user,reply)"/>
  </div>
</template>

<style scoped>

</style>